<template>
  <div class="noticeDetail">
    <x-header class="header" :left-options="{showBack: showHeaderBack}" ref="header">消息详情</x-header>
    <div class="topHolder"></div>
    <card :header="{title:'消息时间：' + noticeInfo.date}" :footer="{title:'消息类型：' + noticeInfo.type }">
      <div slot="content" class="card-padding">
        <span v-text="noticeInfo.title"></span>
      </div>
    </card>
    <card :header="{title:'消息详情：'}">
      <div class="card-padding" slot="content">
        <div class="description" v-html="getRichText(noticeInfo.content)"></div>
      </div>
    </card>
  </div>
</template>

<script>
  import { Card } from 'vux'
  import {contextPath,getNoticeDetail} from "../api";
  import {message} from "../common/util";

  export default {
    name:'noticeDetail',
    data(){
      return{
        contextPath:contextPath,
        showHeaderBack:this.GLOBAL.showHeaderBack,
        paramnNoticeId:this.$route.params.noticeId,
        loadingStatus:true,
        noticeInfo:{}
      }
    },
    components:{
      Card
    },
    computed:{

    },
    methods:{
      getRichText(description){
        var result = description,reg = /<img[^>]*src[=\'\"\s]+([^\"\']*)[\"\']?[^>]*>/gi;
        while (reg.exec(result)){
          let item = RegExp.$1
          if(item.indexOf('http') < 0)result = result.replace(item,this.contextPath + item)
        }
        return result
      }
    },
    mounted(){
      getNoticeDetail(this.paramnNoticeId).then((res)=>{
        if(res.status == 'success'){
          this.noticeInfo = res.data
        }else if(res.status == 'error') {
          message({message:res.msg,type:'error'})
          console.log('getNoticeDetail error info:', res.msg)
        }
        this.loadingStatus = false
        this.$store.commit('updateLoadingStatus',{isLoading:false})
      }).catch((err)=>{console.log('getNoticeDetail catch info:',err)})
    }
  }
</script>

<style lang="scss" scoped>
  .noticeDetail{
  }
</style>
